{% extends "configuration/left_menu.html" %}

{% block right_content %}

<div id="right_menu">
    <div class="row">
        <div class="col-md-2">
            <h3><strong>配置编辑器</strong></h3>
        </div>
        <div class="col-md-10">
            <div class="alert-msg"></div>
        </div>

    </div>
    <hr/>

    <div class="row ">
        <div class="col-md-5">
            <div class="input-group">
                <input id="config_path_auto" type="text" class="form-control" placeholder="请输入配置文件的路径" onkeyup="searchConfigPath()" style="width: 324px;">
                <span class="input-group-btn">
                    <button type="button" id="config_content_fetcher" class="btn btn-info" style="position: relative;left: -18px;">获取配置文件的内容</button>
                </span>
            </div>
        </div>
        <div class="col-md-1">
            <button type="button" id="reload" class="btn btn-info hint hint-top" data-hint="将svn和manager节点同步" style="position: relative;left: 60px; top: 4px;"><span class="glyphicon glyphicon-refresh"></span></button>
        </div>
        <div class="col-md-1">
            <button class="btn btn-info hint hint-top" data-hint="清空内容!" id="cleaner" data-toggle="modal" data-target="#cleanConfirmModal" style="position: relative;top: 4px;"><span class="glyphicon glyphicon-remove"></span></button>
        </div>
        <div class="col-md-1 col-md-offset-2">
            <button id="saver" class="btn btn-success hint hint-top" data-hint="保存更改" style="float: right; position: relative; top: 4px;right: -80px;"><span class="glyphicon glyphicon-ok-circle"></button>
        </div>
    </div><br>
    <div class="row">
        <div class="col-md-12">
            <!-- <div id="editor" style="height:560px;"></div> -->
            <textarea id="editor2" class="form-control" style="width: 90%; height: 500px;background-color: #FFFFFF;">
            </textarea>
        </div>
    </div>
</div>

<div class="modal fade" id="cleanConfirmModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title" id="myModalLabel">确认框</h4>
            </div>
            <div class="modal-body">
                确认清空吗？
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                <button id="confirm_clean" type="button" class="btn btn-primary" data-dismiss="modal">保存更改</button>
            </div>
        </div>
    </div>
</div>

<script type="text/javascript">


    $('#saver').click(function() {

        var saved_cfg_content = $('#editor2').val();

        if(saved_cfg_content == '') {
            alert_msg('danger', '内容不能为空!')
            return
        }

        var url = "{% url 'configuration:putRemoteFile' %}";
        var postdata = { content: saved_cfg_content, 
                         filename: $('#config_path_auto').val()
                       }

        var ret_data = $.ajax({
                url : url,
                type : "POST",
                data : postdata,
                async : false,
                cache : false
        });

        if(ret_data.status != 200 ) {
            alert_msg('danger', '服务器响应失败!')
            return 
        } 

        var status = ret_data.responseJSON.status;

        if(status != 1) {
            alert_msg('danger', '保存数据失败!');
            return;
        }
        alert_msg('success', '保存数据成功!');

    });

    $('#confirm_clean').click(function() {
        $('#editor2').val('');
    });

    var available = [];

    function searchConfigPath(){
        
        var config_path = $("#config_path_auto").val();

        if(config_path!=''){
            var urls = "{% url 'configuration:getConfigurePath' %}";
            var postdata = {search:config_path}
            var jsonstr = $.ajax({
			    url : urls,
			    type : "POST",
			    data : postdata,
			    async : false,
		        cache : false
		    });

            if (jsonstr.status == 500) {
                alert_msg('danger', '服务器端内部错误!');
                return 
            } 
		    var jsonobj = eval('(' + jsonstr.responseText + ')');

		    if(jsonobj.status == 1){
		        available = [];
		        for(var i in jsonobj.data){
		            available.push(jsonobj.data[i]);
		        }
		    }
        }
    }

    $('#config_path_auto').autocomplete({
        source: function( request, response ) {
            response($.grep( available, function( item ){
                return available;
            }));
        }
    });

    $('#config_content_fetcher').click(function() {

        var real_path = $("#config_path_auto").val();
        if (!real_path) {
            alert_msg('danger', '请填写配置文件路径!');
            return 
        }

        var urls = "{% url 'configuration:getRemoteFile' %}";
        var postdata = { filename: real_path };
        var ret_data = $.ajax({

            url : urls,
            type : "POST",
            data : postdata,
            async : false,
            cache : false

        });

        var jsonstr = ret_data.responseJSON
        if(ret_data.status != 200 ) {
            alert_msg('danger', '服务器错误!');
            return 
        }

        if(jsonstr.status != 1) {
            alert_msg('danger', '读取配置文件错误!');
            return
        } else {
            $('#editor2').val(jsonstr.data);
        }
    });

</script>

{% endblock %}

